<!-- vue文件的三种标签 
    template: 编写html代码
    script:   编写TS或JS代码
    style:    编写样式代码
 -->

<template>
  <!-- 标签a可以向子元素传递普通的字符串面量值，:list可以传递script中定义的数组元素 -->
  <Person ref="ren" a="111" :list="persons"/>
</template>

<script lang="ts" setup>
    import Person from './components/Person.vue'
    import {type Persons} from '@/types'
    import { reactive } from 'vue'

    // 使用index.ts中定义的数组类型
    let persons = reactive<Persons>([
        {id: '123465', name: '张三', age: 18},
        {id: '123466', name: '李四', age: 19},
        {id: '123467', name: '王五', age: 20}
    ])


</script>
